import React from 'react';
import ProCard from '@ant-design/pro-card';
import ProTable from '@ant-design/pro-table';
import styles from '@/pages/trade/Item/index.less';
import { connect } from 'umi';

const HistoryCard = (props) => {
  const { item } = props;
  const { trades } = item;

  const valueEnum = {
    0: '创建',
    1: '转让',
    2: '定价',
    3: '交易',
    4: '授权定价',
    5: '授权',
    6: '拍卖定价',
    7: '交易',
    8: '报价',
    9: '取消交易',
  };

  const columns = [
    {
      title: '序号',
      valueType: 'index',
    },
    {
      title: '类型',
      dataIndex: 'type',
      valueEnum,
    },
    {
      title: '发起方',
      render: (_, record) => {
        return record.from.username;
      },
    },
    {
      title: '接收方',
      render: (_, record) => {
        if (record.type === 1 || record.type === 4 || record.type === 6) {
          return '';
        }
        return record.to.username;
      },
    },
    {
      title: '价格',
      dataIndex: 'price',
      valueType: 'money',
    },
    {
      title: '创建时间',
      dataIndex: 'createdAt',
      valueType: 'dateTime',
    },
  ];

  return (
    item && (
      <ProCard className={styles.itemCard} headerBordered title="操作记录">
        <ProTable
          rowKey="id"
          options={false}
          search={false}
          columns={columns}
          dataSource={trades}
        ></ProTable>
      </ProCard>
    )
  );
};

export default connect(({ item }) => ({
  item: item.item,
}))(HistoryCard);
